<template>
  <div class="list">
    <el-page-header @back="$router.go(-1)" :content="$route.meta.title"></el-page-header>
    <el-form size="small" :inline="true" :model="whereData" class="search-from">
      <el-form-item>
        <el-input @keyup.enter.native="fetchData()" clearable v-model="whereData.dealNo" placeholder="结算单号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-input @keyup.enter.native="fetchData()" clearable v-model="whereData.dealNo" placeholder="收款方账户名称"></el-input>
      </el-form-item>
      <el-form-item>
        <el-input @keyup.enter.native="fetchData()" clearable v-model="whereData.dealNo" placeholder="结算周期"></el-input>
      </el-form-item>
      <el-form-item>
        <el-date-picker
          style="width: 260px"
          v-model="whereData.daterange"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        ></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="fetchData()">查询</el-button>
      </el-form-item>
    </el-form>
    <el-table
      :data="tableData"
      v-loading="isLoading"
      style="width: 100%">
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="name"
        label="结算单号">
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="address"
        label="收款方客户账号">
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="address"
        label="收款方账户姓名">
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="address"
        label="收款方开户行名称">
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="address"
        label="支付金额">
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="address"
        label="结算金额">
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="address"
        label="注册账号">
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="address"
        label="结算周期">
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="address"
        label="导入时间">
      </el-table-column>
    </el-table>
    <div class="h2 line">驳回理由：</div>
    <div style="padding: 20px;">审核不通过</div>
  </div>
</template>
<script>
import tableMixin from '@/common/mixins/tableData'
export default {
  name: 'list',
  mixins: [tableMixin],
  data() {
    return {
      activeName: 'all',
      whereData: {
        company: '',
        index: '',
        dealNo: '',
        daterange: ''
      }
    }
  },
  methods: {
    handleClick(name) {
      this.fetchData()
    }
  }
}
</script>
<style lang="less" scoped>
.total {
  font-size: 14px;
  margin-bottom: 10px;
  .danger-text {
    font-size: 18px;
  }
}
</style>